Welcome to HTMLPad 2004

  • About Features
  • Working with files
  • Editing HTML and XHTML
  • Editing style sheets
  • Editing scripts
  • Purchasing
  • Online Support


Feature overview

HTMLPad is a agile, flexible and easy to use web document editor with good set of features and some powerful tools.

Special code writing features enable you to instantly create and edit HTML, XHTML and CSS code, while integrated tools allow you to easily validate, reuse, navigate and format your code.

HTMLPad provides convenient environment for working with JavaScript, ASP, PHP, SSI and Perl scripts. Syntax highlighting is available for all these languages and some special tools for writing scripts can help even more.


End User License agreement

HTMLPad 2004 License agreement

Before you use HTMLPad 2004 software, please read this agreement. You may use this software only as described in this license.

1. SOFTWARE

The capitalized term "Software" used below refers to HTMLPad 2004 version 5.0, any updates to the software, any supplemental code provided to you by Karlis Blumentals, the user manual, any associated software components, any related media and printed materials, and any "online" or electronic documentation.

2. COPYRIGHT

The Software is copyright 1999-2004, Karlis Blumentals. The Software is licensed, not sold.

3. EVALUATION VERSION

You may use (launch) the Software 50 times for evaluation purposes without any charge. You must pay the license fee and register your copy to continue to use the Software after the evaluation uses (launch times) are over. Otherwise, you must delete (uninstall) the Software from your computer. For information on paying the license fee and registering your copy of the Software, you should choose "Help|Register..." from the Menu Bar. During the evaluation period, you may use the Software on as many different computers as you like.

4. REGISTERED VERSION

Upon enabling (or installing) the registered copy, you may use the Software on that number of computers for which you have paid a separate license fee, and the primary user of each computer for which you have paid a separate license fee may use the Software on his or her portable computer. You may also make one copy of the Software for backup or archival purposes. Otherwise, you may not copy the registered Software in whole or in part. If the registered copy of the Software is installed on a network server or other storage device, you must purchase a license for each separate computer on which the Software is used. A license for the Software may not be shared by alternating use of the Software between different computers. You may permanently transfer all of your rights to the registered copy of the Software under this license provided you transfer all copies of the Software and the recipient agrees to the terms of this license. All rights not expressly granted under this license are reserved by Karlis Blumentals.

5. DISCLAIMER

THIS SOFTWARE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING, BUT NOT LIMITED TO WARRANTIES OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY DAMAGES, INCLUDING INCIDENTAL OR CONSEQUENTIAL DAMAGES, ARISING OUT OF THE USE OF THIS SOFTWARE, WHETHER OR NOT ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. YOU ACKNOWLEDGE THAT YOU HAVE READ THIS LICENSE, UNDERSTAND IT AND AGREE TO BE BOUND BY ITS TERMS.

6. DISTRIBUTION

The Software may be distributed freely in its original unmodified and unregistered form. The distribution has to include all files of its original distribution. Distributors may not charge any money for it.

7. OTHER RESTRICTIONS

You may not modify, reverse engineer, decompile or disassemble the Software in any way, including changing or removing any messages or windows. You are not allowed to change any part of the Software. Karlis Blumentals keeps full rights to change any part of the Software. You may not rent, lease, or lend the Software.

8. TERMINATION

This license terminates if you fail to comply with its terms and conditions. If your license terminates, you must destroy all copies of the Software you have. The termination of this license does not limit Karlis Blumentals' other rights he may have by law.

If you have any questions about this license agreement, please mail to: support@blumentals.net

HTMLPad 2004 © 1999-2004 Karlis Blumentals


Registering HTMLPad 2004

HTMLPad 2004 is available for a free evaluation period. Users who decide to continue using the program must purchase and register the software. If you do not purchase and register your copy of HTMLPad 2004 within the evaluation period, the program will cease to function. Note that by registering the software, you enable us to improve it and design new features.

Pricing

Product | Price
HTMLPad 2004 Pro | $38.85
HTMLPad 2004 Standard | $25.85

Site licenses are also available. To view our current price list, click here.

You can register

  • Online
  • By phone, fax and postal mail
  • Paying author directly

Special Offers

You can purchase HTMLPad 2004 bundled with other products and receive huge discounts. Please visit our online store.

Note

  • All version updates are free to registered users.

Related Topics

  • Enable full version


Enable full version

After you have registered your copy of the software you will receive instructions how to download full version or unlock your copy.

Note

  • If you have any problems or questions, please, e-mail us to: sales@blumentals.net


Register Online

If you would like to purchase a license for HTMLPad 2004, you can order on-line:

Edition | Price | Purchase
HTMLPad 2004 Pro | $38.85 | Buy Now
HTMLPad 2004 Standard | $25.85 | Buy Now

Site licenses are also available. To view our online price list, click here.

Related Topics

  • Enable full version


Register by phone, fax or postal-mail

Please print out registration form for HTMLPad 2004 Pro or HTMLPad 2004 Standard and fax or mail it to:

ShareIt!
element 5 AG
Vogelsanger Str. 78
50823 Cologne
Germany

Phone: +49-221-2407279
Fax: +49-221-2407278
E-Mail: register@shareit.com

Information for US and Canadian customers

US and Canadian customers may also order by calling toll-free 1-800-903-4152. You will need to name product ID. For HTMLPad 2004 Pro it is 201248, for HTMLPad 2004 Standard it is 201247.

This hotline is only for ordering. Unfortunately, we cannot provide any technical assistance or technical information about the program. You must contact us directly for technical support at: http://www.blumentals.net/support

US check and cash orders can be sent to US office at:

ShareIt! Inc.
P.O. Box 844
Greensburg, PA 15601, USA
Phone: (724) 850 - 8186
Fax: (724) 850 - 8187

ALL CHECKS SENT TO THE U.S. OFFICE MUST BE MADE PAYABLE TO: "ShareIt!Inc."

Related Topics

  • Enable full version


Register by paying author directly

To register HTMLPad 2004 by paying author directly

  1. Send e-mail to sales@blumentals.net Please include:
    • Direct HTMLPad 2004 registration in the subject line
    • whether you want to purchase Pro or Standard edition
    • your full name
    • your postal address
    • your e-mail address
  2. You will receive information about registration payment.
  3. As soon as we receive your payment, we will immediately send you instructions how to unlock full version.

Related Topics

  • Enable full version


Working with files

In HTMLPad you can work with various file types - HTML, XHTML, CSS, WML, ASP, PHP, XML and many other. You can create new documents from scratch or instant templates. You can open existing files not only from your local disk but also directly from FTP server or Web site. You can save documents not only to your local disk but also directly to FTP server.

The following topics provide more information:

  • Create a new File
  • Create an HTML document
  • Create a Cascading Style Sheet
  • Open a file
  • Open a file from FTP
  • Open a file from the Web
  • Save file
  • Save file to FTP


Create a new file

You can create a new HTML, XHTML, CSS, WML, ASP, PHP, XML, Perl or other document from scratch or instant template.

To create an empty file

  1. On the File menu, click New.
  2. Click the type of the document you wish to create
  3. Click OK.

To create new file from a template

  1. On the File menu, click New from Template.
  2. In the New from Template window locate and click template you wish to use for your new document.
  3. Click OK.

Notes

  • To create an empty document of the default type (specified in Preferences), just click New [image] on the toolbar.
  • You can use an arrow near toolbar buton New [image], to quickly create an empty file of a specific type.

Related Topics

  • About templates


Create a new HTML document

You can create an empty HTML document or use one of available templates.

To create an empty HTML document

  1. On the File menu, click New.
  2. Select HTML document type.
  3. Click OK.

To create an HTML document from a template

  1. On the File menu, click New from Template.
  2. In the New from Template window, click HTML tab and then click template you wish to use for your HTML document.
  3. Click OK.

Notes

  • If the default new document type specified in Preferences is HTML (as it is by default), just click New [image] on the toolbar.

Related Topics

  • About templates


Create a new CSS style sheet

You can create an empty CSS document or use one of available templates.

To create an empty CSS document

  1. On the File menu, click New.
  2. Select CSS document type.
  3. Click OK.

To create a CSS document from a template

  1. On the File menu, click New from Template.
  2. In the New from Template window, click CSS tab and then click template you wish to use for your document.
  3. Click OK.

Related Topics

  • About templates


Open a file

To open a file

  1. On the File menu, click Open.
  2. Locate the file you wish to open.
  3. Click Open.

Notes

  • You can also click Open [image] on the toolbar.
  • To quickly access recently used files, use Reopen submenu on the File menu.

Related Topics

  • Open a file from FTP
  • Open a file from the Web


Open a file from FTP

To open a file from FTP server

  1. On the File menu, click Open from FTP.
  2. In the FTP Browser dialog box from Sites list select an FTP site or click New Site [image] on the toolbar to add new FTP site.
  3. When your FTP site is listed and selected, click Connect [image] on the toolbar.
  4. Locate the file you wish to open.
  5. Click Open.

Note

  • If connection to FTP site can not be established, please, make sure that you have entered correct properties for your FTP site and that internet connection is present and FTP server is up and running.


Open a file from the Web

To open a file from Web server

  1. On the File menu, click Open from Web.
  2. Enter HTTP address of the file you wish to open.
  3. Click OK.

Note

  • If connection to Web site can not be established, please, make sure that you have entered correct address.


Save file

To quickly save a document, click Save [image] on the toolbar.

To save a copy of a file

  • On the File menu, click Save As.
  • In the File name box, enter a new name for the file.
  • Click Save.

Note

  • To save all open files at once, click Save All [image] on the toolbar.

Related Topics

  • Save file to FTP


Save file to FTP

To quickly save a file that has been open form FTP server, click Save [image] on the toolbar.

To save new or local file to FTP server

  1. On the File menu, click Save to FTP.
  2. In the FTP Browser dialog box from Sites list select an FTP site or click New Site [image] on the toolbar to add new FTP site.
  3. When your FTP site is listed and selected, click Connect [image] on the toolbar.
  4. In the file name box type a name for your file. Include extension (e.g. .htm) in the file name.
  5. Click Save.

Note

  • If connection to FTP site can not be established, please, make sure that you have entered correct properties for your FTP site and that internet connection is present and FTP server is up and running.


Using File Explorer

File Explorer allows to browse files and folders, just like Windows Explorer. You can open a file by double-clicking it. You can cut, copy, delete and rename files using popup menu which can be activated by left-clicking the file. Same operations can be done with folders.

To enable File Explorer, on the View menu click File Explorer.


Search for text

To search for text

  1. On the Search menu, click Find.
  2. In the Search for box, enter the text that you want to search for.
  3. Select any other options that you want.
    Click here to find more about options.
  4. Click Find Next.

Related Topics

  • Find/Replace window
  • Using Search Toolbar


Search for text in files

To search for text in files

  1. On the Search menu, click Find in Files.
  2. In the Look in box, enter the folder where to look for files or click Browse to pick a folder.
  3. Near the Look in box, select or type in file mask (e.g. *.* or *.htm).
  4. In the Search for box, enter the text you want to find.
  5. Select any other options that you want.
    Click here to find more about options.
  6. Click Find.

Notes

  • You can also click Find in Files [image] on the Search toolbar.
  • Searching through large amounts of files may take a while.

Related Topics

  • Find in Files window


Find and replace text

To find and replace text

  1. On the Search menu, click Replace.
  2. In the Search for box, enter the text that you want to replace.
  3. In the Replace with box, enter the replacement text.
  4. Select any other options that you want.
    Click here to find more about options.
  5. Click Find Next, Replace, or Replace All.

Related Topics

  • Find/Replace window


Find next or previous

You can quickly navigate to next and previous occurrence of your search text.

To find next occurrence

  • On the Search menu, click Find Next or press F3.

To find previous occurrence

  • On the Search menu, click Find Previous or press Ctrl+F3.

Note

  • You can also click Find Next [image] or Find Previous [image] on the toolbar.

Related Topics

  • Using Search Toolbar


Find matching bracket

To find matching bracket

  • On the Search menu, click Match Bracket.


Find/Replace window

Find/Replace window allows to search for and replace text.

Search for

Specifies text to be searched.

Replace with

Specifies replacement text.

Find Next

Finds specified text.

Replace

Replaces search text with replacement text and finds next occurrence of search text.

Replace All

Relpaces all occurrences of search text with replacement text.

Options

Case sensitive

Searches only for occurrences that match the combination of uppercase and lowercase characters you enter in the Search for box.

Whole words only

Searches only for whole words rather than matching the text you enter in the Search for box as it occurs within words.

Regular expressions

Enables regular expression search.

Direction

Forward

Enable to search text from top to bottom.

Backward

Enable to search text from bottom to top.

Origin

From cursor

Enable to search text starting from cursor position .

Entire scope

Enable to start search from the very beginning.

Scope

Global

Searches through all text.

Selected text

Searches only through selected text.

Related Topics

  • Using Regular Expressions


Find in Files window

Find in Files window allows to search for text in files on your drive.

Search for

Specifies text to be searched.

Look in

Specifies folder to look for files.

Look in subfolders

Indicates that the search includes files located in folders that are within the folders specified in the Look in box.

Find

Executes search operation.

Browse

Displays Browse for Folder dialog box which allows to pick Look in folder rather then enter it from keyboard.

Close

Closes Find in Files window and cancels current search (if any).

Close when search complete

Indicates that when search operation is complete, Find in Files window should close automatically.

Options

Case sensitive

Searches only for occurrences that match the combination of uppercase and lowercase characters you enter in the Search for box.

Whole words only

Searches only for whole words rather than matching the text you enter in the Search for box as it occurs within words.


Using regular expressions

Find and Replace features support regular expressions, enabling you to find or replace strings based on patterns.

Regular expression operators

^ | A circumflex at the start of the string matches the start of a line.
$ | A dollar sign at the end of the expression matches the end of a line.
. | A period matches any character.
* | An asterisk after a string matches none or any number of occurrences of that string.
+ | A plus sign after a string matches one or more occurrences of that string.
[ ] | Characters in brackets match any one character that appears in the brackets, but no others.
[^] | A circumflex at the start of the string in brackets means NOT.
[-] | A hyphen within the brackets signifies a range of characters. For example, [a-z] matches any character from a through z.
{ } | Braces group characters or expressions.

Examples

ab+ | Matches ab, abb, abbb ...
ab* | Matches a, ab, abb ...
a{bc}+ | Matches abc, abcbc ...
<img[^>]+> | Matches HTML image tags e.g. <img src="image.gif">
[a-z0-1]+ | Matches any alphanumeric word e.g. abc, 123, abc123 ...

Escaping operators

In order to search for literal instances of characters that denotes regular expression operators, you must escape them with a \ . For example, \^ matches ^ and does not look for the start of a line.


Using bookmarks

You can set a "bookmark" to mark a position in a file. Once a bookmark has been set at a line, you may use menu or keyboard commands to move to that line.

To set a bookmark

  1. Move the cursor to the position where you want to set a bookmark.
  2. On the Search menu, click Toggle Bookmarks.

To go to a bookmark

  1. On the Search menu, click Toggle Bookmarks.


Using Search toolbar

Search toolbar allows to perform quick searches and access search coomands.

Search toolbar commands

Find box allows to search text quickly. Just input the text and hit Enter.
 | Find allows to quickly access Find command.
 | Replace allows to quickly access Replace command.
 | Find Previous allows to quickly locate previous occurrence of last search text.
 | Find Next allows to quickly locate next occurrence of last search text.
 | Find in Files allows to quickly access Find in Files command.
 | Match Bracket will find matching bracket.


Move text using drag & drop

You can use the mouse to move or copy text within a document, as follows:

To move selected text

  1. Hold the Left mouse button down in the selection.
  2. Drag the cursor to the new location.
  3. Release the left button.

To copy selected text

  1. Hold down Ctrl and Left mouse button down in the selection.
  2. Drag the cursor to the new location.
  3. Release the left button.

To cancel a drag-drop operation

  • Press ESC, or
  • Click the right button, or
  • Release the left button in the selection.

Note

  • The Ctrl key can be pressed or released at any time before releasing the left button, to make the drag a copy or a move.


Indent and unindent text

You can easily increase and decrease text indent to format your code.

To increase text indent

  1. Select the text you wish to indent
  2. On the Edit menu, click Increase Indent or press Shift+Ctrl+I

To decrease text indent

  1. Select the text you wish to unindent
  2. On the Edit menu, click Decrease Indent or press Shift+Ctrl+U

Note

  • You can also use Indent [image] and Unindent [image] buttons on the toolbar.


Check spelling

To check spelling in the current document

  1. On the Tools menu, click Spelling Check.
  2. For each word that is not recognized a dialog box will appear.
  3. In the Spelling dialog box:
    • To change unrecognized word with replacement in Change to box, click Change.
    • To ignore unrecognized word, click Ignore.
    • To ignore all unrecognized words and complete spelling check, click Ignore All.
    • To make the word recognized, click Add to add it to dictionary.
    • To abort spelling check, click Cancel.

Note

  • You can highlight unrecognizd words with a red underline. To enable or disable unrecognized word highlighting, on the Options menu, click Auto Spell Check

Related Topics

  • Change spelling check language


Using Extended Clipboard

Extended clipboard will collect items as you copy and cut. You can then paste them or drag them into your document.

To view extended clipboard contents, on the Edit menu, click Extended Clipboard. Panel Clipboard will appear.

To insert an item from extended clipboard into your document, just drag it from Clipboard panel to the desired location in your text.

Note

  • Double-clicking Clipboard panel item will insert it into your document at current caret position.


Editing HTML and XHTML

Special code writing features enable you to instantly create, edit and validate HTML and XHTML code.

Standards compilance

HTMLPad suggests and generates code according to selected HTML specification. Currently supported are HTML 4.01, XHTML 1.0, XHTML 1.1. You can select HTML specification for HTMLPad to work with or let it be done automatically based on your HTML document DOCTYPE section.

  • HTML specification

Writing HTML and XHTML code

HTMLPad offers tools that make code editing easy and convenient. HTML code generators allow to insert instant HTML code, Inspector allows to modify HTML tags quickly, Auto Complete helps to remember and type tag and attribute names.

  • Using Inspector
  • Using Auto Complete
  • Creating HTML code

Validating HTML and XHTML code

You can validate and fix your code using built in validator - HTML Tidy.

  • Using HTML Tidy

Previewing HTML pages

You can preview HTML directly in its document window, you can also automatically open your HTML in any installed Web browser.

  • Previewing HTML pages


Using Inspector

HTML Inspector allows to make quick changes to an HTML tag. Once caret is inserted inside an HTML tag, Inspector displays a list of attributes supported by the tag. Code is automatically updated as you change the attribute values using editing fields provided by Inspector.

To enable Inspector, on the View menu click Inspector.

Notes

  • Many inspector fields have attached buttons. These buttons invoke drop down boxes or dialog windows which help entering attribute value.
  • To delete an attribute using Inspector, simply clear its value field.

Related Topics

  • Editing HTML and XHTML
  • Using Auto Complete


Using Auto Complete

Auto Complete allows to reduce the amount of typing, by displaying list of valid elements and attributes that can be inserted with a single mouse click or Enter key.

Notes

  • Auto Complete can be disabled via Preferences dialog window.
  • Auto Complete popup delay time can be customized via Preferences dialog window.
  • To close Auto Complete popup, press Esc.

Related Topics

  • Editing HTML and XHTML
  • Using Inspector


Creating HTML code

You can create HTML code using Insert and Format menu commands and HTML and Formatting toolbars. Each command inserts specific HTML language element. For exapmle, Hyperlink [image] command will insert HTML hyperlink tag.

Related Topics

  • Editing HTML and XHTML
  • Using Auto Complete
  • Using Inspector


Using HTML Tidy

About HTML Tidy

HTML Tidy is a powerful, free tool for validating and formatting HTML and XHTML documents. HTMLPad integrates with this wonderful tool and provides convenient way to use it.

Tidy is able to fix up a wide range of problems and to bring to your attention things that you need to work on yourself. Each item found is listed with the line number and column so that you can see where the problem lies in your markup. Tidy won't generate a cleaned up version when there are problems that it can't be sure of how to handle. These are logged as "errors" rather than "warnings".

Using HTML Tidy

HTML Tidy can perform many different tasks. Each task must be created and configured, before it can be executed. To save your time, HTMLPad comes with a set of pre-configured HTML Tidy tasks.

To execute one of the HTML Tidy tasks, on the Tools menu point to HTML Tidy submenu and click on the name of the task.

When HTML Tidy checks your document, items such as "errors" and "warnings" generated by HTML Tidy are displayed in the Messages panel. You can quickly navigate to the problem area by double-clicking error or warning item.

To configure HTML Tidy tasks, on the Tools menu point to HTML Tidy submenu and click Manage Tasks.


Previewing HTML documents

You can preview HTML documents directly in HTMLPad or automatically open them in specified Web browser.

Preview without leaving HTMLPad

To quickly preview HTML document without leaving editing environment, click Preview tab at the bottom of the document window.

You can also use one of the Split Screen tabs at the bottom of document window, to switch to horizontal or vertical split screen preview mode which allows you to edit code and preview results instantly.

To preview HTML document in a Web browser

  1. On the Tools menu, point to Preview In.
  2. On the Preview In submenu, click the Web browser you wish to use.

Related Topics

  • Internal preview
  • Using Preview toolbar


HTML and XHTML online resources

References and Specifications

  • HTML 4.01 Specification
  • XHTML 1.0 Specification
  • XHTML 1.1 Recommendation
  • HTML 4.01 Reference by W3Schools
  • XHTML 1.0 Reference by W3Schools

Guides and Tutorials

  • HTML Tutorial by W3Schools
  • XHTML Tutorial by W3Schools

Other Resources

  • W3 MarkUp Validation Service


Editing style sheets

Special CSS code writing features enable you to instantly create and edit cascading style sheets.

Standards compilance

HTMLPad suggests and generates code according to CSS specification. Currently supported are CSS Level 1, CSS Level 2 and Internet Explorer compatible specifications. You can select CSS specification to work with.

  • CSS specification

Writing CSS code

HTMLPad provides tools that make code editing easy and convenient. You can insert instant CSS code, using CSS toolbar nd menu, Inspector allows to add properties and modify values in a convenient way, Auto Complete helps to remember and insert property names as you type.

  • Creating CSS code
  • Using Inspector
  • Using Auto Complete

Previewing style sheets

You can preview CSS directly in its document window, or in any installed Web browser.

  • Previewing style sheets


Creating CSS code

With HTMLPad, you can easily create and edit CSS code with little or no typing.

The following topics provide more information:

  • Working with selectors and rules
  • Editing common properties
  • Using Inspector
  • Using Auto Complete


Working with selectors and rules

Selectors can be easily created, deleted and duplicated using CSS menu and toolbar.

Following CSS menu and toolbar commands are available for working with selectors:

Create Selector opens New Selector dialog box which builds new selector(s) based on options you chose.
Duplicate Selector opens New Selector dialog box which builds new selector(s) based on options you chose, using rules of current selector.
Delete Selector deletes current selector.

Related Topics

  • New Selector dialog
  • Editing style sheets
  • Editing common properties
  • Using CSS Explorer


Editing common properties

You can easily and quickly modify common formatting properties using CSS menu and toolbar without any typing.

Following CSS menu and toolbar commands are available for quick modification of current selector's common properties:

 | Font displays Select Font dialog box and creates font-family property based on selected font(s).
 | Bold adds or removes font-weight: bold.
 | Italic adds or removes font-style: italic.
 | Underline adds or removes text-decoration: underline.
 | Left adds or removes text-align: left.
 | Center adds or removes text-align: center.
 | Right adds or removes text-align: right.
 | Justify adds or removes text-decoration: justify.
 | Set Line Height creates line-height property.
 | Set Text Color displays Color Picker dialog box and creates color property based on selected color.
 | Set Background Color displays Color Picker dialog box and creates background-color property based on selected color.
CSS toolbar displays Font and Font Size drop down boxes for modification of font-family and font-size properties.

Related Topics

  • Editing style sheets
  • Working with selectors
  • Using Auto Complete
  • Using Inspector


Using Inspector

You can use Inspector to quickly add, remove and modify style properties and property values without editing the code directly.

Once caret is inserted inside { and } brackets, Inspector displays a list of supported properties. Code is automatically updated as you cnahge property values.

To enable Inspector, on the View menu click Inspector.

Notes

  • Many inspector fields have attached buttons. These buttons invoke drop down boxes or dialog windows which help entering property value.
  • To remove property using Inspector, simply clear its value field.

Related Topics

  • Editing style sheets
  • Editing common properties
  • Using Auto Complete


Using Auto Complete

Auto Complete allows to reduce the amount of typing, by displaying list of valid property names that can be inserted with a single mouse click or Enter key.

Notes

  • Auto Complete can be disabled via Preferences dialog window.
  • Auto Complete popup delay time can be customized via Preferences dialog window.
  • To close Auto Complete popup, press Esc.

Related Topics

  • Editing style sheets
  • Using Inspector


Using CSS Explorer

CSS Explorer lists all CSS selectors in contained current document. You can navigate to a selector by clicking it. This will make it current selector.

CSS Explorer refreshes automatically as code is edited, but you can also refresh it manually at any time by clicking Refresh button.

Note

  • You can right-click CSS Explorer to open a popup menu with commands for working with selectors.

Related Topics

  • Editing style sheets
  • Working with selectors


Previewing style sheets

You can preview Style Sheets directly in HTMLPad or automatically open them in specified Web browser.

Preview without leaving HTMLPad

To quickly preview CSS document without leaving editing environment, click Preview tab at the bottom of document window.

You can also use one of the Split Screen tabs at the bottom of document window, to switch to horizontal or vertical split screen preview mode which allows you to edit code and preview results instantly.

Style sheets can be previewed in two ways

  • Based on automatically generated web page which generates content for each selector
  • Based on any HTML document of your choice

Style sheet preview mode can be selected using Preview toolbar. Click here to learn more.

To preview CSS document in a Web browser

  1. On the Tools menu, point to Preview In.
  2. On the Preview In submenu, click the Web browser you wish to use.

Related Topics

  • Internal preview
  • Using Preview toolbar


Select Font dialog

Select Font dialog allows to pick font(s) for CSS font-family property.

Generic Fonts

Lists all generic fonts.

To select generic font, click it. Note that you can select one generic font at a time.

Generic font is used when none of other specified fonts are available on the target system.

Installed Fonts

Lists all fonts available on current system.

Select font by marking it checked. Deselect font by marking it unchecked.

Presets

Lists frequently used font combinations.

To select preset, click it. To save contents of Selected Fonts as preset, click Add. To delete preset, select it and click Delete.

Add

Saves contents of Selected Fonts to Presets list.

Delete

Deletes currently selected item from Presets list.

Selected Fonts

Contains list of selected fonts which will be used to specify font-family.


New Selector dialog

New Selector window creates new CSS selector(s).

HTML Element

Specifies HTML element to whom the selector applies.

Pseudo element

Specifies selector's pseudo element (if any).

Pseudo-elements are used in CSS to add different effects to some selectors, or to a part of some selectors.

The syntax of pseudo-classes:
selector:pseudo-element { property: value }

Pseudo class

Specifies selector's pseudo class (if any).

Pseudo-classes are used in CSS to add different effects to some selectors, or to a part of some selectors.

The syntax of pseudo-classes:
selector:pseudo-class { property: value }

Class, ID

Contains class name or ID for creating class or ID selector.

Selector

Contains currently generated selector. You can type this value from keyboard or use previously described controls to create it.

Add

Adds contents of Selector box to Selectors list. This list contains selectors to be created.

Remove

Removes the selected item from Selectors list.

Selectors

Contains selectors that will be created.

Insert as single selector

Indicates that selecors from the list will be grouped and inserted as a single rule.

Insert as separate selectors

Indicates that a separate rule will be created for each selector from the list.

Related Topics

  • Working with selectors and rules


Style sheet online resources

References and Specifications

  • W3 CSS Level 1 Recommendation
  • W3 CSS Level 2 Specification
  • CSS Level 2 Reference by W3Schools

Guides and Tutorials

  • Introduction to CSS by Dave Raggett
  • Style Sheet Guide by Webmonkey
  • CSS Level 2 Reference by W3Schools

Other Resources

  • W3 CSS Validation Service


Editing scripts

HTMLPad provides convenient environment for working with JavaScript, ASP, PHP, SSI and Perl scripts. Syntax highlighting is available for all these languages and some special tools for writing scripts can help even more.

The following topics provide more information:

  • Editing JavaScript
  • Editing ASP
  • Editing PHP
  • Editing SSI
  • Previewing server side scripts


Editing JavaScript

HTMLPad provides special features for JavaScript editing.

JavaScript menu and toolbar

JavaScript toolbar and menu allows to quickly insert common JavaScript structures.

JavaScript Snippets provides a drop-down menu for inserting common JavaScript structures. To edit this menu, click Edit JavaScript Snippets.
Function inserts JavaScript function.
Document Write inserts JavaScript document.write statement.
Alert inserts JavaScript code for displaying alert box.
Confirm inserts JavaScript code for displaying confirmation box.

Object Browser

Object Browser provides convenient way for working with JavaScript objects.

  • Object Browser


Editing ASP

HTMLPad provides special features for ASP editing.

ASP menu and toolbar

ASP toolbar and menu allows to quickly insert common ASP code fragments.

ASP Snippets provides a drop-down menu for inserting common ASP structures. To edit this menu, click Edit ASP Snippets.
ASP Server Variables displays a list of server variables. To insert an item, select it and click OK.
ASP Tag inserts ASP tags <% %>.
ASP Block inserts ASP tags <% and %> in separate lines, creating multi-line ASP code block.
ASP Output Tag inserts ASP output tag <%= %>.
Include File inserts file include tag.
Include Virtual Path inserts virtual include tag.

Object Browser

Object Browser provides convenient way for working with ASP objects.

  • Object Browser


Editing PHP

HTMLPad provides special features for PHP editing.

PHP menu and toolbar

PHP toolbar and menu allows to quickly insert common PHP code fragments.

PHP Snippets provides a drop-down menu for inserting common PHP structures. To edit this menu, click Edit PHP Snippets.
PHP Server Variables displays a list of server variables. To insert an item, select it and click OK.
PHP Tag inserts PHP tags <? ?>.
PHP Block inserts ASP tags <? and ?> in separate lines, creating multi-line ASP code block.
PHP Output Tag inserts ASP output tag <?= ?>.
Include File inserts file include directive.
Require File inserts file require directive.


Editing SSI

HTMLPad provides special features for SSI editing.

SSI menu and toolbar

SSI toolbar and menu allows to quickly insert common SSI tags.

SSI Snippets provides a drop-down menu for inserting common SSI tags. You can edit this menu, to do so, click Edit SSI Snippets.
SSI Server Variables displays a list of server variables. To insert an item, select it and click OK.
Include File inserts file include tag.
Include Virtual Path inserts virtual include tag.


About Object Browser

Object Browser provides convenient way for working with objects of object oriented languages such as JavaScript. Depending on the selected language, Object Browser lists all object classes, their properties, methods and events. You can insert them right into your code by dragging or double clicking.

To enable Object Browser, on the View menu click Object Browser. Then select language from the drop down box at the top of Object Browser pane.


About Markup Browser

Markup Browser provides convenient way for working with markup languages, for example, HTML and WML. Depending on the selected language, Markup Browser lists all tags and their attributes. You can insert them right into your code by dragging or double clicking.

To enable Markup Browser, on the View menu click Markup Browser. Then select language from the drop down box at the top of Markup Browser pane.


Previewing server side scripts

Server side scripts such as ASP or PHP need to be executed on web server, before correct preview can be generated. HTMLPad provides a feature called mappings, which passes scripts through web server before previewing them.

Mappings allow to map your locak file system or FTP folders to web addresses. For example, you can map c:\wwwroot to http://localhost/

To add, edit or remove mapping:

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Preview folder.
  3. Click Mappings.
  4. Click Add, Delete or Edit, to add, delete or edit a mapping.


Preview in web browser

To preview document in web browser

  • On the Tools menu, point to Preview In.
  • On the Preview In submenu, click the Web browser you wish to use.

Related Topics

  • Internal preview
  • Configure web browsers


Preview in document window

To preview file in the same document window, click Preview tab at the bottom of document window.

Related Topics

  • Internal preview
  • Using Preview toolbar


Internal preview

Internal preview allows to preview documents without leaving editing environment.

To activate internal preview, click Preview tab at the bottom of document window.

You can also use one of the Split Screen tabs at the bottom of document window, to switch to horizontal or vertical split screen preview mode which allows you to edit code and preview results instantly.

Notes

  • Internal preview can be customized using Preview toolbar. To show or hide the toolbar, on the View menu, click Preview Toolbar.
  • Sometimes when previewing Web documents, a ruler can be helpful. To show or hide ruler, on the View menu, click Preview Ruler.

Related Topics

  • Using Preview toolbar
  • Preview in Web browser


Using Preview toolbar

Preview toolbar allows to customize internal preview.

To show or hide the toolbar, on the View menu, click Preview Toolbar.

Preview toolbar commands

Preview File box specifies the file or address to be used to generate preview.
 | Open Preview File allows to add preview file. This command is used to select HTML file to preview Style Sheet on.
 | Refresh Preview reloads internal preview. This is useful when the file has changed after the preview was generated.
 | Show Rulers shows or hides internal preview rulers. Rulers are useful for determining element widths and heights in web pages.
 | Close Preview closes the preview pane and enters full window text editing mode. Does the same as clicking Code Editor tab at the bottom of document window.

Related Topics

  • Internal preview


Configure web browsers

You can add and remove web browsers that HTMLPad can use to preview files.

To configure web browsers

  • On the Options menu, click Preferences.
  • In Preferences window, click Preview folder.
  • Click Browsers.

Notes

  • Although HTMLPad auto-detects some browsers the first time you run it, it can't detect all browsers and their versions available.

Related Topics

  • Preview in Web browser


Reusing code

When writing code, whether it is a web page, style sheet or script, very often the same or similar structures and code fragments are used. You can save yor time by reusing once written code. In HTMLPad there are several features that help to reuse code. Library allows to store and reuse code snippets, while templates allow to easily derive new documents from existing ones.

The following topics provide more information:

  • About Templates
  • About Library


About templates

Template is a file that contain the structure from which finished files can be derived. Templates help to create finished documents faster. In most cases it takes less time to create a document by adding content to an existing one rather than writing from scratch.

HTMLPad offers some instant templates, but you can also add your own.

The following topics provide more information:

  • Create file from template
  • Add template


Create file from template

To create new file from a template

  1. On the File menu, click New from Template.
  2. In the New from Template window use tabs to locate template you wish to use for your new document.
  3. Select the template with a single click.
  4. Click OK.

Related Topics

  • About templates
  • Add template


Add template

To add your own template

  1. Open the file you wish to use as template.
  2. On the File menu, click Save As Template. Save dialog opens with current folder set to HTMLPad template folder.
  3. Select any existing subdirecotry or create your own subdirectory.
  4. Enter file name and click OK.

Related Topics

  • About templates
  • Create file from template


About Library

Library is a feature for storing code pieces of code so that you can reuse them later.

Visually Library is a dockable panel displaying set of folders and non folder items - snippets. Library allows you to save unlimited number of code snippets and categorize them in an unlimited folder structure.

HTMLPad already comes with a few useful code fragments stored in Library. You might want to check those ones.

To show or hide Library pane, on the View menu, click Library.

The following topics provide more information:

  • Insert code from Library
  • Add code to Library


Insert code from Library

To use Library, first make sure, Library panel is visible. If not, on the View menu, click Library.

Inserting code snippet from Library into your document is easy.

First way:

  • Place caret in your document where you wish to insert code snippet and double click the snippet in Library panel.

Second way:

  • Just drag the snippet from Library panel to the place in your document where you wish to insert it.

Related Topics

  • About Library
  • Add code to Library


Add code to Library

To add your own code snippet to Library

  1. On the Tools menu click Library Editor.
  2. Select one of available folders or use New Folder or Subfolder button to create a new one.
  3. Click New Snippet.
  4. Snippet Editor appears. In the Name box, enter title for the snippet. Then enter snippet contents in text edit box(es).
  5. Click OK to save code snippet.
  6. Click Close to exit Library editor.

Related Topics

  • About Library
  • Insert code from Library


Customizing text editor

Text editor is very flexible. You can customize various properties of text editing area to fit your needs and working style.

To customize text editor:

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Text Editor folder.
  3. Set options as you like.

Preferences window offers several pages for text editor configuration.

Common tasks

  • Change text colors
  • Toggle line numbers
  • Toggle word wrap
  • Toggle hidden char visibility


Change text colors

You can change colors of syntax highlighting.

To change text colors

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Text Editor folder.
  3. Click Colors.
  4. In the Language section, select language and element whose color you wish to change.
  5. Select Foreground and Background color and text attributes.
  6. Repeat last two steps for each language and element whose color you wish to change.
  7. Click OK.

Related Topics

  • Customizing text editor


Toggle line numbers

You can enable or disable line numbering.

To change line numbering option

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Text Editor folder.
  3. Click General.
  4. Toggle line numbers:
    • To show line numbers, mark Visible gutter and Line numbers on gutter checked.
    • To hide line numbers, mark Line numbers on gutter unchecked. To hide gutter, mark Visible gutter unchecked.
  5. Click OK.

Related Topics

  • Customizing text editor


Toggle word wrap

To toggle word wrap

  1. On the Options menu, click Word Wrap.

Related Topics

  • Customizing text editor


Toggle hidden char visibility

To toggle hidden character visibility

  1. On the Options menu, click Show Hidden Characters.

Related Topics

  • Customizing text editor


Change spelling check language

To change spelling check language

  1. On the Options menu, click Preferences.
  2. In the Preferences window, click Spelling.
  3. Click Configure Spell Checker.
  4. Select a dictionary or click Locate dictionaries to add a new one.
  5. Click OK.

Note

  • You can download additional dictionaries from our web site. They can be added using above procedure.

Related Topics

  • Check spelling


Customize toolbars

Toolbars and menus can be completely customized. You can move, show and hide toolbars. You can evem add and remove toolbar and menu items, create and delete toolbars and do much more.

To hide or show a toolbar

  1. Right-click any toolbar or Main Menu bar.
  2. Click on a toolbar name.

To hide or show a toolbar button

  1. Click the arrow at the far right of the toolbar
  2. Click Add or Remove Buttons.
  3. Click on a button name.

To customize toolbars and menu items

  1. Right-click any toolbar or Main Menu bar.
  2. Click Customize
  3. Open Commands tab
  4. Now you can drag and drop items from commands list to any toolbar or menu. You can also you can remove an item by dragging it off its toolbar or menu.
  5. Close Customize window to finish customization.

Related Topics

  • Customizing panels
  • Working with layouts


Customize panels

Panels are docking windows that can be floating over main window or docked to one of its sides. You can move, show and hide panels. You can change panel positions by dragging and docking.

To rearrange a panel, click on its title bar and drag it to the desired location.

To hide a panel, click on its close button (x).

To show a panel, on the View menu, click its name.

Related Topics

  • Customizing toolbars
  • Working with layouts


Working with layouts

Layout is a combination of toolbar and panel positions and configuration. You can quickly save and load your favorite layouts for maximum convenience.

To save layout

  1. On the View menu click Save Layout.
  2. Enter layout name and click OK.

To load layout

  1. On the View menu click Manage Layouts.
  2. Select the layout and click Activate.

To delete layout

  1. On the View menu click Manage Layouts.
  2. Select the layout name and click Delete.

Note

  • You can also switch layouts using Layout [image] button on the toolbar.

Related Topics

  • Customizing toolbars
  • Customizing panels


HTML specification

HTML specification is an option that tells HTMLPad which HTML language specification to use for creating code with such features as Inspector and Auto Complete.

For example, if you wish to write XHTML 1.0 compilant markup code, you must activate XHTML 1.0 definition.

To change default HTML specification

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Language Options folder.
  3. Click HTML.
  4. From drop down box, select HTML language definition.
  5. Click OK.

Note

  • By default, HTMLPad automatically selects HTML specification based on the DOCTYPE tag of current document and default HTML specification is used only if no valid DOCTYPE tags are present. You can change this behavior in Preferences window near HTML Language Specification box.


CSS specification

CSS specification is an option that tells HTMLPad which CSS language specification to use for creating code with such features as Inspector and Auto Complete.

For example, if you wish to write CSS Level 2 compilant style sheets, you must activate CSS Level 2 definition.

To change active CSS definition

  1. On the Options menu, click Preferences.
  2. In Preferences window, click Language Options folder.
  3. Click CSS.
  4. From drop down box, select CSS language definition.
  5. Click OK.


Online resources

Blumentals Software provides numerous online resources and support options.

  • Blumentals Software Home
  • Customer Support Webiste
  • Customer Support Forum


How to report problems

Have you checked our online support page first?

Please provide at least the following information with any problem report

  • The version number of your copy of the program. You can determine it using the About command on the Help menu.
  • The version of Windows that you're using.
  • How to reproduce the problem.
  • Detailed description of the problem.

E-mail your completed report to: support@blumentals.net


Color Picker dialog

Color Picker dialog allows to pick HTML and CSS color values.

Palette

Specifies currently selected color palette. colors of the palette are displayed in color grid.

Value

Contains hexadecimal value of the selected color.

Name

Displays name for the selected color (if any).

Custom

Displays standard color dialog box for selecting specific color.

Select

Allows to pick any color from the screen.


Registration Form

Registration Form for HTMLPad 2004 Pro

Program No.: 201248

Customer Information

Last name: __________________________________

First name: __________________________________

Company: ___________________________________

Street and #: ________________________________

City, State, postal code: _______________________

Country: _____________________________

Phone: _______________________________

Fax: _________________________________

E-Mail: _______________________________

*** Please do not forget to include your e-mail address.
We will use e-mail to communicate with you.

How would you like to receive the registration key?

e-mail
fax
postal mail

How would you like to pay the registration fee:

credit card
wire transfer
check
cash

Credit Card Information (if applicable)

Credit Card:

Visa
Eurocard/Mastercard
American Express
Diners Club

Card Holder: _________________________

Card No.: ___________________________

Expiration Date: ______________

Date / Signature: ______________________


Registration Form

Registration Form for HTMLPad 2004 Standard

Program No.: 201247

Customer Information

Last name: __________________________________

First name: __________________________________

Company: ___________________________________

Street and #: ________________________________

City, State, postal code: _______________________

Country: _____________________________

Phone: _______________________________

Fax: _________________________________

E-Mail: _______________________________

*** Please do not forget to include your e-mail address.
We will use e-mail to communicate with you.

How would you like to receive the registration key?

e-mail
fax
postal mail

How would you like to pay the registration fee:

credit card
wire transfer
check
cash

Credit Card Information (if applicable)

Credit Card:

Visa
Eurocard/Mastercard
American Express
Diners Club

Card Holder: _________________________

Card No.: ___________________________

Expiration Date: ______________

Date / Signature: ______________________